import React from 'react'
import qs from 'qs'

import { useLocation, useParams } from 'react-router-dom'

export default function News() {

  // params 参数
  const { id } = useParams()

  // search 参数
  const { user } = qs.parse(useLocation().search.split('?'))

  // state 参数
  const { list } = useLocation().state

  return (
    <div>
      <h3>News</h3>
      <div>
        <p>编号: {id} 用户: {user}</p>
        <ul>
          {
            list.map(item => {
              const { id, content } = item
              return (
                <li key={id}>{content}</li>
              )
            })
          }
        </ul>
      </div>
    </div>
  )
}